<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
        <title>Welcome to wfaces</title>
        <meta name="description" content="NONE" />
        <meta name="keywords" content="Key, words, of, the, page" />
        <link href="http://localhost/wfaces/assets/css/bootstrap/css/bootstrap.css" rel="stylesheet" type="text/css" media="screen" />    
        <link href="http://localhost/wfaces/assets/css/bootstrap/css/reset.css" rel="stylesheet" type="text/css" media="screen" />    
        <link href="http://localhost/wfaces/assets/css/bootstrap/css/text.css" rel="stylesheet" type="text/css" media="screen" />    
        <link href="http://localhost/wfaces/assets/css/wfaces.css" rel="stylesheet" type="text/css" media="screen" />    
        <link href="http://localhost/wfaces/assets/css/chat.css" rel="stylesheet" type="text/css" />
        <script type="text/javascript"  src="http://localhost/wfaces/assets/js/jquery.js">
        </script>
    </head>
    <body>
        <div class="container">
            <div class="row">
                <div class="span12">
                    <div class="span3" style="margin-left:0px">
                        <img class="logo" src="http://localhost/wfaces/assets/img/wfaces4.1.png"/>
                    </div>
                    <div class="span6">
                        &nbsp;
                    </div>
                    <div class="span3">
                        <div class="session">
                            <img src="http://localhost/wfaces/assets/css/../pht/13.jpg" width="25px" height="25px" /> 
                            <span class="connected-user">
                                Khalid LASTNAME                                </span>
                            <img src="http://localhost/wfaces/assets/img/arrow.png"/>              
                        </div>
                    </div>
                    <!-- end .span12 -->
                </div>
            </div> 
            <div class="row">
                <div class="span12 hr">
                    &nbsp;
                </div>
                <div class="span5">
                    &nbsp;
                </div>
                <div class="span2">
                    <div id="infos">
                        <span id="notifs">
                            0                        </span>
                    </div>
                </div>
                <div class="span5">
                    &nbsp;
                </div>
            </div>
            <div class="row">
                <script type="text/javascript" src="http://localhost/wfaces/assets/js/chat.js" >
                </script>
                <style>
                    .img{
                        width:50px;
                        height:50px;
                    }
                </style>
                <script type="text/javascript">
                    var notifNumber = 0;

                    var whatsUpUrl = "http://localhost/wfaces/index.php/notifications/whatsUp" + "/";

                    var sendUrl = "http://localhost/wfaces/index.php/chat/send";

                    var newsUrl = "http://localhost/wfaces/index.php/chat/getNews";

                    var withUrl = "http://localhost/wfaces/index.php/chat/with";

                    var tofsUrl = "http://localhost/wfaces/assets/css/../pht/";

                    var delNotifsUrl = "http://localhost/wfaces/index.php/chat/delNotifs";

                    $(document).ready(function() {
                        // $("#scrollDiv").jScrollPane({showArrows:true});
                        console.log("tofsUrl = " + tofsUrl);
                        $("#frm_chat_sub").click(function() {
                            send("frm_chat");
                            return false;
                        });

                        //Pour les notifications
                        update(notifNumber);
                        ajaxStop();
                        waterMark(".waterMarkInput");
                        waterMark(".search");
                    });

                </script>


                <div class="row">

                    <div class="row">
                        <div class="span4">
                            <div class="row">
                                <div class="span4 rounded" id="chatingWith">

                                </div>
                                <div  class="span4 rounded" id="discussion" >


                                </div>
                                <div class="span4" >
                                    <form action="http://localhost/wfaces/index.php/chat/send" method="post" accept-charset="utf-8" id="frm_chat"><!--                    <input class="waterMarkInput" title="Your message here" size="33" id="chatText"  name="message" />-->
                                        <div class="input-append">
                                            <textarea  id="chatText"  name="message" class="input-large" rows="2"></textarea>
                                            <button class="btn btn-primary" type="submit" id="frm_chat_sub" style="height:50px;">
                                                Send  <i class="icon-white icon-ok"></i>
                                            </button>
                                        </div>
                                        <input type="hidden" value="" id="withId" name="with"  />
                                    </form>                </div>
                            </div>
                        </div>

                        <div class="span8">
                            <script type="text/javascript">
                                var searchUrl = "http://localhost/wfaces/index.php/social/search";
                            </script>
                            <script type="text/javascript">
                                var searchUrl = "http://localhost:8888/wfaces/index.php/social/search";
                            </script>
                            <div class="row">
                                <div class="span5 rounded">
                                    <div class="span5">
                                        <form action="http://localhost/wfaces/index.php/chat/55" method="post" accept-charset="utf-8" id="frm_search" class="form-search">            
                                            <div class="input-append">
                                                <input title="search for a friend" class="search-query" type="text" style="width: 312px; "  name="search"/>
                                                <input type="submit" value="ok" class="btn btn-primary" id="users_search"/>
                                            </div>
                                        </form>        </div>
                                    <div class="span5 rounded" style="border:1px solid #ccc;">
                                        <div class="row heightAndScroll">
                                            <div class="span1 notSelected" style=" height: 60px; width:59px">
                                                <a href="javascript:loadChatWith('14');">
                                                    <img src="http://localhost/wfaces/assets/css/../pht/14.jpg"  />
                                                </a>
                                                <!-- Tooltip of the image :
                                                    <div class="span2 notSelected">
                                                    <p>Younes LASTNAME</p>
                                                    <p>Casablanca, Maroc</p>
                                                    <p>1998-03-06</p>
                                                    <span id="ntf14"></span>
                                                    <p>disponible</p>
                                                    </div>
                                                -->
                                            </div>
                                            <div class="span1 notSelected" style=" height: 60px; width:59px">
                                                <a href="javascript:loadChatWith('15');">
                                                    <img src="http://localhost/wfaces/assets/css/../pht/15.jpg"  />
                                                </a>
                                                <!-- Tooltip of the image :
                                                    <div class="span2 notSelected">
                                                    <p>Med LASTNAME</p>
                                                    <p>Casablanca, Maroc</p>
                                                    <p>1998-03-06</p>
                                                    <span id="ntf15"></span>
                                                    <p>disponible</p>
                                                    </div>
                                                -->
                                            </div>
                                            <div class="span1 notSelected" style=" height: 60px; width:59px">
                                                <a href="javascript:loadChatWith('16');">
                                                    <img src="http://localhost/wfaces/assets/css/../pht/16.jpg"  />
                                                </a>
                                                <!-- Tooltip of the image :
                                                    <div class="span2 notSelected">
                                                    <p>Said LASTNAME</p>
                                                    <p>Casablanca, Maroc</p>
                                                    <p>1998-03-06</p>
                                                    <span id="ntf16"></span>
                                                    <p>disponible</p>
                                                    </div>
                                                -->
                                            </div>
                                            <div class="span1 notSelected" style=" height: 60px; width:59px">
                                                <a href="javascript:loadChatWith('17');">
                                                    <img src="http://localhost/wfaces/assets/css/../pht/17.jpg"  />
                                                </a>
                                                <!-- Tooltip of the image :
                                                    <div class="span2 notSelected">
                                                    <p>Souad LASTNAME</p>
                                                    <p>Casablanca, Maroc</p>
                                                    <p>1998-03-06</p>
                                                    <span id="ntf17"></span>
                                                    <p>disponible</p>
                                                    </div>
                                                -->
                                            </div>
                                            <div class="span1 notSelected" style=" height: 60px; width:59px">
                                                <a href="javascript:loadChatWith('21');">
                                                    <img src="http://localhost/wfaces/assets/css/../pht/./14.jpg"  />
                                                </a>
                                                <!-- Tooltip of the image :
                                                    <div class="span2 notSelected">
                                                    <p>Taoufik LASTNAME</p>
                                                    <p>Casablanca, Maroc</p>
                                                    <p>1988-03-06</p>
                                                    <span id="ntf21"></span>
                                                    <p>disponible</p>
                                                    </div>
                                                -->
                                            </div>
                                        </div>
                                    </div>
                                </div>

                                <div class="span3" style="border:1px solid #ccc">
                                    &nbsp;HELLO
                                </div>

                            </div>
                            <script>
                                $("#users_search").click(function() {
                                    search("frm_search");
                                    return false;
                                });
                            </script>
                        </div>

                    </div>

                </div> 
            </div>
            <div style="height:50px;">
                &nbsp;
            </div>
            <div class="row" >
                <div class="span12" style="margin-top: 40px; padding-top: 10px; border-top:1px solid #ccc; text-align: center">
                    <img width="50px" src="http://localhost/wfaces/assets/img/wfaces4.1.png"/>
                </div>
            </div>
            <div style="height:50px;">
                &nbsp;
            </div>
        </div>

        <!-- end .container_12 -->
    </body>
</html>